<!-- 物流详细信息 -->
<template>
	<van-popup :show="isShow" position="bottom" round @click-overlay="$emit('getClose')">
		<view class="p_font_28 p_flex7 p_margin_tb_48">详细信息</view>
		<view class="l_title p_font_26">物流名称：{{infoName}}</view>
		<view class="l_title p_font_26">物流单号：{{infoNum}}</view>
		<view class="l_wrapper">
			<view class="p_flex l_list" v-for="(item, index) in listData" :key="index">
				<view class="p_margin_r_40">
					<view class="line3"></view>
					<view class="p_img_20"></view>
					<view class="line4"></view>
				</view>
				<view class="p_flex_1">
					<view class="p_font_24 l_date">{{item.ftime}}</view>
					<view class="p_font_28 p_margin_t_6 l_info">{{item.context}}</view>
				</view>
			</view>
		</view>
	</van-popup>
</template>

<script>
	export default {
		props: {
			isShow: {
				type: Boolean,
				default: false
			},
			infoId: {
				type: String,
				default: ''
			},
			infoNum: {
				type: String,
				default: ''
			},
			infoName: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				listData: [],
			}
		},
		created() {
			// this.getExpress();
		},
		methods: {
			getExpress(e) {
				this.$http.post(this.$api.express, {
					id: e?e: this.infoId
				}).then(res => {
					this.listData = res.data;
				})
			}
		}
	}
</script>

<style lang="less">
	.l_title {
		padding: 0 92rpx;
		margin-bottom: 10rpx;
		// text-align: center;
	}
	
	.l_wrapper {
		padding: 48rpx 32rpx;
		max-height: 60vh;
		overflow-y: auto;
	}

	.line3 {
		height: 8rpx;
	}

	.line4 {
		height: calc(100% - 28rpx);
	}

	.line3,
	.line4 {
		width: 1px;
		background-color: #E8E8E8;
		margin: 0 auto;
	}

	.l_info {
		margin-bottom: 48rpx;
	}

	.p_img_20 {
		background-color: #ECECEC;
	}

	.l_date {
		color: #B2B2B2;
	}

	.l_list {
		&:first-child {
			.p_img_20 {
				background-color: #05B570;
			}

			.line3 {
				background-color: #fff;
			}

			.l_date,
			.l_info {
				color: #05B570;
			}
		}

		&:last-child {
			.l_info {
				margin-bottom: 0;
			}

			.line4 {
				height: 0;
			}
		}
	}
</style>